document.addEventListener('DOMContentLoaded', function () {
    // 获取元素
    const modeSwitcher = document.getElementById('modeSwitcher');
    const modeText = document.getElementById('modeText');
    const statusIndicator = document.getElementById('statusIndicator');
    
    // 当前模式状态（true为编辑模式，false为展示模式）
    let isEditMode = false;
    if (modeText.textContent === '编辑模式') {
        isEditMode = true;
    } else {
        isEditMode = false;
    }

    // 更新界面显示
    function updateModeDisplay() {
        if (isEditMode) {
            modeText.textContent = '编辑模式';
            modeSwitcher.className = 'mode-switcher edit-mode';
            statusIndicator.textContent = '当前模式: 编辑模式';
            statusIndicator.className = 'status-indicator indicator-edit';
        } else {
            modeText.textContent = '展示模式';
            modeSwitcher.className = 'mode-switcher show-mode';
            statusIndicator.textContent = '当前模式: 展示模式';
            statusIndicator.className = 'status-indicator indicator-show';
        }
    }
    // 模式切换处理
    modeSwitcher.addEventListener('click', function (e) {
        console.debug("switch")
        e.preventDefault();
        
        if (isEditMode) {
            // 在编辑模式下点击，跳转到退出登录
            const toast = document.createElement('div');
            toast.innerHTML = `
                    <div class="position-fixed top-50 start-50 translate-middle" style="z-index: 2000;">
                        <div class="toast fade show bg-primary text-white" role="alert">
                            <div class="toast-body d-flex align-items-center">
                                <i class="fas fa-door-open me-2" style="font-size: 24px;"></i>
                                <span class="fs-5">正在退出编辑模式...</span>
                            </div>
                        </div>
                    </div>
                `;
            document.body.appendChild(toast);

            // 模拟跳转到/login/out
            setTimeout(() => {
                window.location.href = '/login/out';
                isEditMode = false;
                updateModeDisplay();
                toast.remove();
            }, 2000);
        } else {
            // 在展示模式下点击，跳转到登录页
            const toast = document.createElement('div');
            toast.innerHTML = `
                    <div class="position-fixed top-50 start-50 translate-middle" style="z-index: 2000;">
                        <div class="toast fade show" style="background: linear-gradient(45deg, #27ae60, #1a75bc); color: white;" role="alert">
                            <div class="toast-body d-flex align-items-center">
                                <i class="fas fa-sign-in-alt me-2" style="font-size: 24px;"></i>
                                <span class="fs-5">正在进入编辑模式...</span>
                            </div>
                        </div>
                    </div>
                `;
            document.body.appendChild(toast);

            // 模拟跳转到/login/index
            setTimeout(() => {
                window.location.href = '/login/index';
                isEditMode = true;
                updateModeDisplay();
                toast.remove();
            }, 2000);
        }
    });
    // 初始化显示
    updateModeDisplay();
});


